iT邦幫忙

2024 iThome 鐵人賽

DAY 2
0
自我挑戰組

Web Franework -SASS/SCSS系列 第 2

Day 2 - 了解SASS和SCSS

  • 分享至 

  • xImage
  •  

今天要來跨出我的第一步:
#什麼是SASS和SCSS呢?
SASS(Syntactically Awesome Stylesheets)是為了讓CSS的撰寫更加高效,靈活,並且同時也讓CSS新增了一些功能,像是變數、嵌套、模塊化等功能。而SCSS(Sassy CSS)是SASS的語法之一,相較於SASS,與CSS的語法會更為相似,可以同時使用CSS的語法和SASS所提供的功能,也因此SCSS會是SASS中最常見的語法版本。

#SASS和SCSS之間的差異
SASS特點:語法較為簡潔,無需分號和大括號。
SCSS特點:更為接近CSS,需要分號和大括號。

#為什麼要學習使用SASS和SCSS呢?
相比於傳統的CSS來管理規模漸增的網頁專案,以SASS和SCSS作為CSS的預處理器,可以提供許多強大的功能來管理網頁專案,如:我們可以透過變數,將常用的樣式額外抽出來,做統一管理,使得樣式的修改更簡單方便。而SASS和SCSS還有提供嵌套、模塊化管理、Mixins和繼承等功能,方便我們更好的應對管理網頁專案可能會遇到的困難,因此我覺得學習使用SASS和SCSS是非常值得的!

今天的學習分享就到這邊,如果我的見解有任何錯誤,歡迎指教!
加油!!!


上一篇
Day 1 - 簡介
下一篇
Day 3 - 變數、嵌套
系列文
Web Franework -SASS/SCSS26
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言